<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:ui="http://java.sun.com/jsf/facelets"
	  xmlns:h="http://java.sun.com/jsf/html"
	  xmlns:f="http://java.sun.com/jsf/core"
 	  xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">

		<ui:composition template="/plantillas/comun.xhtml">
			<ui:define name="pageTitle">
				<h:outputText value="Actividades - Vimeworks"/>
			</ui:define>
			<ui:define name="pageContent">
				<h:form>
					<h3>
						<h:outputText value="Administraci&#243;n de Actividades"/>
					</h3>
					<rich:collapsiblePanel header="Datos de la Tarea" style="width: 755px;">
						
						<h:panelGrid columns="2">
						   
							<h:outputText value="Tarea:" style="font-weight: bold;"/>
							<h:outputText value="#{actividad.tarea.descripcion}" />
							 <h:outputText value="Tipo Tarea: " style="font-weight: bold;"/>
							<h:outputText value="#{actividad.tarea.tipoTarea.nombre}" />
							<br/>
							
						</h:panelGrid>
						<h:commandButton value="Volver a Listado de Tareas" action="#{actividad.volverAListado}" />
					</rich:collapsiblePanel>
					<br/><br/>
					<rich:collapsiblePanel header="Actividades" style="width: 755px;">
						<h:outputText value="Nombre:" />
						<h:inputText value="#{actividad.nombreBusqueda}"/>
						<a4j:commandButton value="Buscar" action="#{actividad.buscar}" render="listadoActividades" execute="@form"/>
						<a4j:commandButton value="Nueva" render="panelIngreso" action="#{actividad.nuevaActividad}" 
					                   oncomplete="#{rich:component('modalNuevaActividad')}.show(); return false;"/>
					
					<br/><br/>
					
					
					<h:panelGroup id="listadoActividades" >
						<rich:dataTable id="tablaActividades" value="#{actividad.listaActividad}" var="activ" rows="5" noDataLabel="No se han encontrado resultados" style="width: 725px;">
							<rich:column>
								<f:facet name="header">
									<h:outputText value="C&#243;digo" />
								</f:facet>
								<h:outputText value="#{activ.codigo}" />
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="Nombre" />
								</f:facet>
								<h:outputText value="#{activ.descripcion}" />
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="Fecha Inicio" />
								</f:facet>
								<h:outputText value="#{activ.fechaInicio}" ><f:convertDateTime pattern="yyyy-MM-dd" /></h:outputText>
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="Fecha Fin" />
								</f:facet>
								<h:outputText value="#{activ.fechaFin}" ><f:convertDateTime pattern="yyyy-MM-dd" /></h:outputText>
							</rich:column>
							<rich:column>
							<f:facet name="header">
									<h:outputText value="Opciones" />
								</f:facet>
								<a4j:commandLink actionListener="#{actividad.editar(activ)}" oncomplete="#{rich:component('modalActualizarActividad')}.show(); return false;" render="panelActualizacion">
									<h:graphicImage value="/images/info.png" width="20px" height="20px" title="Editar"/>
								</a4j:commandLink>
																<h:outputText value="&#160;&#160;&#160;"/>
								<h:commandLink action="#{actividad.ingresarDoc}">
									<h:graphicImage value="/images/libro.png" width="20px" height="20px" title="Ingresar Documentos"/>
									<f:setPropertyActionListener target="#{actividad.actividadSelec}" value="#{activ}"/>
								</h:commandLink>
								
							</rich:column>
						</rich:dataTable>
						<rich:dataScroller for="tablaActividades" maxPages="5" />
					</h:panelGroup>
					</rich:collapsiblePanel>
				</h:form>
				
				
				<rich:popupPanel id="modalNuevaActividad" modal="true" autosized="true">
					<f:facet name="header">
						<h:outputText value="Ingreso de Actividad" />
					</f:facet>
					<h:form>
						<a4j:outputPanel id="panelIngreso" >
							<h:panelGrid columns="2">
								<h:outputText value="Descripci&#243;n:"/>
								<h:panelGroup>
									<h:inputTextarea id="descripcionNuevaAct" value="#{actividad.descripcion}" rows="3" cols="40" >
										<f:validator validatorId="validadorNoVacio"/>
									</h:inputTextarea>
									<rich:message ajaxRendered="true" for="descripcionNuevaAct"/>
								</h:panelGroup>
								<h:outputText value="Fecha Inicio:" />
								<h:panelGroup>
									<rich:calendar value="#{actividad.fechaInicio}" datePattern="dd/MM/yyyy">
										<f:validator validatorId="validadorNoVacio"/>
									</rich:calendar>
								</h:panelGroup>
								<h:outputText value="Fecha Fin:" />
								<h:panelGroup>
									<rich:calendar value="#{actividad.fechaFin}" datePattern="dd/MM/yyyy">		
										<f:validator validatorId="validadorNoVacio"/>
									</rich:calendar>
								</h:panelGroup>
							</h:panelGrid>
							<br/>
							<a4j:commandButton value="Guardar" action="#{actividad.guardarActividad()}" 
											   render="listadoActividades" data="#{facesContext.maximumSeverity.ordinal ge 2}" 
							                   execute="@form" oncomplete="ocultarModal('modalNuevaActividad', event.data);">
							</a4j:commandButton>
							<a4j:commandButton value="Cancelar" action="#{actividad.cancelar}" 
							                   oncomplete="#{rich:component('modalNuevaActividad')}.hide(); return false;" 
							                   render="panelIngreso" immediate="true"/>
						</a4j:outputPanel>
					</h:form>
				</rich:popupPanel>
				
				<rich:popupPanel id="modalActualizarActividad" header="Actualizaci&#243;n de Actividades" modal="true" autosized="true" maxWidth="1000">
				
				<h:form>
						<a4j:outputPanel id="panelActualizacion" >
							<h:panelGrid columns="2">
								<h:outputText value="Descripci&#243;n:"/>
								<h:panelGroup>
									<h:inputText id="descripcionNuevaActe" value="#{actividad.actividadSelec.descripcion}" maxlength="50" size="60">
										<f:validator validatorId="validadorNoVacio"/>
									</h:inputText>
									<rich:message ajaxRendered="true" for="descripcionNuevaActe"/>
								</h:panelGroup>
								<h:outputText value="Fecha Inicio:" />
								<h:panelGroup>
									<rich:calendar value="#{actividad.actividadSelec.fechaInicio}" datePattern="dd/MM/yyyy">
										<f:validator validatorId="validadorNoVacio"/>
									</rich:calendar>
								</h:panelGroup>
								<h:outputText value="Fecha Fin:" />
								<h:panelGroup>
									<rich:calendar value="#{actividad.actividadSelec.fechaFin}" datePattern="dd/MM/yyyy">		
										<f:validator validatorId="validadorNoVacio"/>
									</rich:calendar>
								</h:panelGroup>
							</h:panelGrid>
							<br/>
							<a4j:commandButton value="Guardar" action="#{actividad.actualizarActividad}" 
											   render="listadoActividades" data="#{facesContext.maximumSeverity.ordinal ge 2}" 
							                   execute="@form" oncomplete="ocultarModal('modalActualizarActividad', event.data);">
							</a4j:commandButton>
							<a4j:commandButton value="Cancelar" action="#{actividad.cancelar}" 
							                   oncomplete="#{rich:component('modalActualizarActividad')}.hide(); return false;" 
							                   render="panelIngreso" immediate="true"/>
						</a4j:outputPanel>
					</h:form>
					
				
				
				</rich:popupPanel>
				
				
			</ui:define>
		</ui:composition>
	
</html>